import * as React from 'react';
import {observer} from 'mobx-react'
import styles from './index.scss';

import StackBar from '../../home/StackBar'
import ScatterBarFour from '../../home/ScatterBarFour'

interface IProps {
    title: string
    interruptY1?: number[]
    interruptY2?: number[]
    interruptY3?: number[]
    interruptY4?: number[]
    interruptX?: string[]
    isFour: boolean
    legend?: string[]
}


@observer
class Home extends React.Component<IProps> {

    constructor(props) {
        super(props);
    }


    public render() {
        const {title, interruptX, interruptY1, interruptY2, interruptY3, isFour, interruptY4, legend} = this.props
        return (
            <div className={styles.EChart}>
                {
                    isFour ?
                        <ScatterBarFour interruptY4={interruptY4} interruptY3={interruptY3} interruptY2={interruptY2}
                                        interruptX={interruptX} interruptY1={interruptY1} />
                        :
                        <StackBar interruptX={interruptX} interruptY1={interruptY1}
                                  interruptY2={interruptY2} legend={legend}
                                  interruptY3={interruptY3} />
                }
            </div>
        );
    }
}

export default Home;
